'use client'

import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
import { Pencil } from 'lucide-react'
import React from 'react'

interface VersionControlProps {
  currentVersion: string
  versions: string[]
  onVersionChange: (version: string) => void
}

const VersionControl: React.FC<VersionControlProps> = ({
  currentVersion,
  versions,
  onVersionChange
}) => {
  return (
    <Select value={currentVersion} onValueChange={onVersionChange}>
      <SelectTrigger className="w-[180px]">
        <SelectValue placeholder="Select version" />
      </SelectTrigger>
      <SelectContent>
        {versions.map((version) => (
          <SelectItem key={version} value={version}>
            Version {version}
          </SelectItem>
        ))}
        <SelectItem value="edit">
          <Pencil className="mr-2 h-4 w-4 inline-block" />
          编辑版本
        </SelectItem>
      </SelectContent>
    </Select>
  )
}

export default VersionControl